<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
request.setAttribute("path", path);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>头像照片-卓应商城</title>

	<link rel="stylesheet" href="/common/css/userinfo/base.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/global.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/header.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/home.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/user.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/bottomnav.css" type="text/css">
	<link rel="stylesheet" href="/common/css/userinfo/footer.css" type="text/css">

	<script type="text/javascript" src="/common/js/jquery-1.11.3.js"></script>
	<script type="text/javascript" src="/common/js/order/header.js"></script>
	<script type="text/javascript" src="/common/js/order/home.js"></script>
	
	
	<script>
		$(document).ready(function(){
			//文件上传表单控件
			$("#file-submit").click(function(){
				$(this).removeAttr("href");
				$(".upload-form").submit();
			});
			
		});
	</script>
	
</head>
<body>
		<!-- 顶部导航 end -->

		<!-- 头部 start -->
		<div class="header w1210 bc mt15">
			<!-- 头部上半部分 start 包括 logo、搜索、用户中心和购物车结算 -->
			<div class="logo w1210">
				<h1 class="fl" >
					<a href="/user/loginreg/index">
						<img src="http://localhost:8083/fileserver/logo/logo.jpg" style="height: 70px; width: 150px;">
					</a>
				</h1>
			</div>
			<!-- 头部上半部分 end -->

			<div class="clear"></div>

			<!-- 导航条部分 start -->
			<div class="nav w1210 bc mt10">
				<div class="navitems fl">
					<ul class="fl">
						<li class="current">
							<a href="/user/loginreg/index">首页</a>
						</li>
						<li>
							<a href="/product/fytype">商品大全</a>
						</li>
						<li>
							<a href="/product/showtype?tid=1">手机频道</a>
						</li>
						<li>
							<a href="/product/showtype?tid=2">数码产品</a>
						</li>
						<li>
							<a href="/product/showtype?tid=3">家用电器</a>
						</li>
						<li>
							<a href="/product/showtype?tid=5">衣装服饰</a>
						</li>
						<li>
							<a href="/product/showtype?tid=7">电子图书</a>
						</li>
					</ul>
					<div class="right_corner" style="float:right;">
						<a href="/shopcar/show">购物车</a>
					</div>
				</div>
			</div>
			<!-- 导航条部分 end -->
		</div>
		<!-- 头部 end-->

		<div class="clear"></div>

		<!-- 页面主体 start -->
		<div class="main w1210 bc mt10">
			<div class="crumb w1210">
				<h2>
					<strong><a href="/user/userinfo">个人中心</a></strong>
					<span>></span>
					<span>头像照片</span>
				</h2>
			</div>

			<!-- 左侧导航菜单 start -->
			<div class="menu fl">
				<h3><a href="/user/userinfo">个人中心</a></h3>
				<div class="menu_wrap">
					<dl>
						<dt>订单中心</dt>
						<dd>&nbsp;&nbsp;
							<a href="/order/show">我的订单</a>
						</dd>
						<dd>&nbsp;&nbsp;
							<a href="/user/mycollect">我的收藏</a>
						</dd>
					</dl>
					<dl>
						<dt>账户中心</dt>
						<dd class="cur">&nbsp;&nbsp;
							<a href="/user/userinfo">个人信息</a>
						</dd>
						<dd>&nbsp;&nbsp;
							<a href="/user/showaddress">收货地址</a>
						</dd>
					</dl>
					<dl>
						<dt>个人卖家</dt>
						<dd>&nbsp;&nbsp;
							<a href="/systemer/usertjsp">个人卖家中心</a>
						</dd>
					</dl>
				</div>
			</div>
			<!-- 左侧导航菜单 end -->

			<!-- 右侧内容区域 start -->
			<div class="content fl ml10">
				<!-- 头部信息 start -->
				<div class="user_hd">
					<div class="head-left">
						<h3><a href="/user/userinfo">个人信息</a></h3>
					</div>
					<div class="head-left">
						<h3><a href="/user/userimg">头像照片</a></h3>
					</div>
				</div>
				<!-- 头部信息 end -->
				
				<!-- 中间部分显示图片以及修改图片 start -->
				<div class="user_bd mt10 update-face-cont">
					<div class="update-lcol">
						<div class="mb10">
							<form class="upload-form" action="/user/upload" method="post"  enctype="multipart/form-data">
								<input class="btn-file-submit" type="file" name="imgFile" />
								<a id="file-submit" class="btn-submit" href="">上传</a>
							</form>
							<div style="color:#999;">仅支持JPG、GIF、PNG、JPEG、BMP格式，文件小于4M</div>
						</div>
						<div class="img-b-cont img-cont">
							<div class="img-b">
								<img id="bigImage" src="http://localhost:8083/fileserver/userimg/${user.userImg}" width="150px" height="150px" />
							</div>
						</div>
					</div>
					<div class="update-rcol">
						<div class="smt">
							<h3>效果预览</h3>
						</div>
						<div class="smc">
							你上传的图片会自动生成2种尺寸，请注意小尺寸的头像是否清晰
							<div class="img-m-cont img-cont">
								<div class="img-s">
									<img id="midImage" src="http://localhost:8083/fileserver/userimg/${user.userImg}" width="100px" height="100px" />
								</div>
							</div>
							100*100像素
							<div class="img-s-cont img-cont">
								<div class="img-s">
									<img id="smaImage" src="http://localhost:8083/fileserver/userimg/${user.userImg}" width="50px" height="50px" />
								</div>
							</div>
							50*50像素 
						</div>
					</div>
					<div class="clear"></div>
				</div>
				<!-- 中间部分显示图片以及修改图片 end -->
			</div>
		</div>
		<!-- 页面主体 end-->

		<div class="clear"></div>
		
		<!-- 底部版权 start -->
		<div class="footer w1210 bc mt10">
			<div class="mt20">Joinlabs商城|JYUI|聊|多看书城|JY路由器|视频电话|JY天猫店|JY淘宝直营店|JY网盟|JY移动|隐私政策|Select Region</div>
			<div>©JY.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号</div> 
			<div>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</div>
		</div>
		<!-- 底部版权 end -->
	</body>
</html>